<section ng-init="loadModuleDatas()">
    <div class="card">
        <div class="card-body">
            <filter-list request="request" callback="loadMoreModuleDatas()"></filter-list>
            <div class="btn-toolbar btn-toolbar-sm justify-content-end mt-3" role="toolbar"
                aria-label="Toolbar with button groups">
                <div class="">
                    <a href="/portal/module-data/details/{{activedData.id}}" class="btn btn-sm btn-primary px-3">
                        <i class="fas fa-plus"></i> Add Data
                    </a>
                    <a ng-click="exportModuleData()" class="btn btn-sm btn-primary text-light px-3">
                        <i class="fas fa-arrow-down"></i> Download Data
                    </a>
                    <a ng-if="isAdmin" href="/portal/module/details/{{activedData.id}}" class="btn btn-sm btn-primary px-3">
                        <i class="fas fa-pen"></i> Edit Module
                    </a>
                </div>
            </div>
            <hr>
            <mix-module-data-table data="activedData.data"
                can-drag="request.orderBy === 'Priority' && request.direction === '0'" edit-url="editDataUrl"
                columns="dataColumns" on-delete="removeData(id)"
                on-update-infos="updateDataInfos(activedData.data.items)">
            </mix-module-data-table>
        </div>
        <div class="card-footer">

            <paging class="small" page="activedData.data.page" page-size="activedData.data.pageSize"
                total="activedData.data.totalItems" ul-class="pagination justify-content-end m-0" a-class="page-link"
                paging-action="loadMoreModuleDatas(page-1)" scroll-top="true"></paging>
        </div>
    </div>
</section>